//防抖函数
//当一个函数执行次数太频繁，消耗资源，比如图片加载以后重置滚动组件的高度
import { debounce } from "common/utils"

import BackTop from "components/content/backTop/BackTop" //返回顶部组件

export const itemListenerMixin = {
  data() {
    return {
      itemImgListener: null //首页图片加载监听事件
    }
  },
  mounted() {
    //利用防抖执行图片加载回调函数
    const refresh = debounce(this.$refs.scroll.refresh,200)
    //监听GoogsListItem组件发送的事件总线，用于解决滚动组件高度的问题
    //监听GoogsListItem组件图片加载完成的事件
    //对监听事件进行保存
    this.itemImgListener = () => {
      //this.$refs.scroll.refresh()
      refresh()
    }
    this.$bus.$on('itemImageLoad', this.itemImgListener)

  }
}

//抽取返回顶部的按钮
export const backTopMixin = {
  components: {
    BackTop
  },
  data() {
    return {
      isShowBackTop: false //控制返回顶部按钮是否显示
    }
  },
  methods: {
    //子组件返回顶部的单击事件
    backClick() {
      //通过ref拿到子组件的scroll对象，要用refs访问对象 组件要加ref标签  ref="scroll"
      //返回顶部
      this.$refs.scroll.scrollTo(0,0,500)
    },
    listenShowBackTo(position) {
      //当坐标y轴大于1000的时候显示返回顶部按钮
      this.isShowBackTop = -position.y >1000
    }
  }
}